<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/cookie.js"></script>
    <style>
        *{padding:0;margin: 0;}
        li{
            list-style: none;
        }
        a{
            color: inherit;
            text-decoration: none;
        }
        .header{
            width: 1226px;
            margin: 0px auto;
            background: grey;
            line-height: 40px;
            color: #fff;
            font-size: 12px;

            & ul{
                display: flex;

                & li{
                    padding: 0 10px;
                }
                .site-nav-info{

                }
            }
        }
    </style>
</head>
<body>
    <div class="header">
        <ul class="nav">
            <li>中国大陆</li>
            <li class="site-nav-sign">
                <a href="./login.html">亲，请登录</a>
                <a href="./login.html">免费注册</a>
            </li>
            <li class="site-nav-info">
                <a href="javascript:;" class="tips">欢迎,xxx</a>
                <a href="javascript:;" class="exit">退出</a>
            </li>
            <li>手机淘宝</li>
            <li>网页无障碍</li>
        </ul>
    </div>
</body>
<script>
    var siteNavSign = document.querySelector(".site-nav-sign");
    var siteNavInfo = document.querySelector(".site-nav-info");


    // 判断用户是否登陆
    var lgc = getCookie("lgc");
    if(lgc){
        var tips = document.querySelector(".site-nav-info .tips");
        var exit = document.querySelector(".site-nav-info .exit");

        tips.textContent = `欢迎您,${lgc}`;

        exit.onclick = function(){
            deleteCookie("lgc");
            location.reload(); // 退出刷新
        }

        siteNavSign.remove();
    }else{
        siteNavInfo.remove();
    }


</script>
</html>